<template>
  <div>
    <div class="title-wrapper">
      <h3>{{ showTree ? '合同段' : '检查表'}}</h3>

      <div class="button-wrapper">
        <Button @click="handleBackClick" ghost type="primary">返回</Button>
      </div>
    </div>

    <TreeView v-if="showTree" />
    <FormView v-else />

    <ApprovalSidebar
    :id="dataId"
    :type="type"
    :flowType="approvalName"
    :visible = "true"
    model="default"
    ref="approvalSidebar" />
  </div>
</template>

<script>
import ApprovalSidebar from '@/components/approval-sidebar/index';
import FormView from './form-view';
import TreeView from './tree-view';
import { ApprovalType } from '@/config/cfg';

export default {
  components: {
    ApprovalSidebar,
    FormView,
    TreeView
  },
  data () {
    return {
      // 没有审批流程 21361 有审批流程 21349
      dataId: '',
      type: '',
      approvalName: 0

    };
  },
  computed: {
    showTree () {
      // eslint-disable-next-line eqeqeq
      return this.type == ApprovalType.SP_TYPE_XMHF;
    }
  },
  created () {
    const { dataid, type, approvalName } = this.$route.query;
    this.dataId = dataid;
    this.type = type;
    this.approvalName = approvalName;
  },
  methods: {
    handleBackClick () {
      this.$router.go(-1);
    }
  }
};
</script>

<style lang="less" scoped>
.title-wrapper {
  margin-bottom: 10px;
  display: flex;
  justify-content: space-between;
  align-items: center;

  .button-wrapper {
    .ivu-btn {
      margin-left: 10px;
    }
  }
}
</style>
